 
<!--微信用户标签--> 
  
<link rel="stylesheet" type="text/css" href="__STATIC__/weixin/assets/sell/baseui/css/amazeui.css"/>
<link rel="stylesheet" type="text/css" href="__STATIC__/weixin/assets/sell/baseui/css/admin.css"/>
<link rel="stylesheet" type="text/css" href="__STATIC__/weixin/assets/sell/css/style.css"/>




<!--[if (gte IE 9)|!(IE)]><!-->
	<script type="text/javascript" src="//cdn.bootcss.com/jquery/2.2.2/jquery.min.js"></script>
	<script type="text/javascript" src="//cdn.bootcss.com/fastclick/1.0.6/fastclick.min.js"></script>
  	<script>$(function() {FastClick.attach(document.body);});</script>
<!--<![endif]-->

<!--[if lte IE 8 ]>
	<script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
	<script type="text/javascript" src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
	<script type="text/javascript" src="__STATIC__/weixin/assets/sell/baseui/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->

<script type="text/javascript" src="//cdn.bootcss.com/amazeui/2.7.2/js/amazeui.min.js"></script>

<div class="am-modal am-modal-alert" tabindex="-1" id="fq_alert">
  <div class="am-modal-dialog">
    <div class="am-modal-hd" id="fq_alert_title"></div>
    <div class="am-modal-bd" id="fq_alert_info">
    </div>
    <div class="am-modal-footer">
      <span class="am-modal-btn">确定</span>
    </div>
  </div>
</div>

<div class="am-modal am-modal-confirm" tabindex="-1" id="fq_confirm">
  <div class="am-modal-dialog">
    <div class="am-modal-hd" id="fq_confirm_title"></div>
    <div class="am-modal-bd" id="fq_confirm_info"></div>
    <div class="am-modal-footer">
      <span class="am-modal-btn" data-am-modal-confirm>确定</span>
    </div>
  </div>
</div>

<div class="am-modal am-modal-confirm" tabindex="-1" id="fq_true_confirm">
  <div class="am-modal-dialog">
    <div class="am-modal-hd" id="fq_true_confirm_title"></div>
    <div class="am-modal-bd" id="fq_true_confirm_info"></div>
    <div class="am-modal-footer">
		<span class="am-modal-btn" data-am-modal-confirm>确定</span>
		<span class="am-modal-btn" data-am-modal-cancel class="cancel">取消</span>
    </div>
  </div>
</div>
  
<!-- content start -->
	<div class="admin-content">
		<div class="admin-content-body">
			<div class="am-margin-top-sm am-margin-left">
				<strong class="am-text-primary am-text-lg">会员标签</strong> / <small>Members tags</small>
			</div>
			<div class="am-margin" style="min-width:970px;">
				<style>
					.tags_list_table tr td{
						vertical-align:middle !important;
					}
					.tag_name{
						height:32px;
						padding:0 5px;
					}
					.set_remark,.set_tags{
						position:relative;
					}
					.popover{
						position:absolute;
						top:100%;
						left:0;
						margin-top:12px;
						border:1px solid #ddd;
						background:#fff;
						z-index:1;
					}

					.set_tags .news_tag_box{

						position:absolute;

						top:100%;

						right:0;

						margin-top:12px;

						border:1px solid #ddd;

						background:#fff;

						z-index:1;

					}

					.popover_arrow{

						position: absolute;

						  left: 10%;

						  margin-left: -8px;

						  margin-top: -8px;

						  display: inline-block;

						  width: 0;

						  height: 0;

						  border-width: 8px;

						  border-style: dashed;

						  border-color: transparent;

						  border-top-width: 0;

						  border-bottom-color: #d9dadc;

						  border-bottom-style: solid;

					}

					.popover .popover_arrow_out,.news_tag_box .popover_arrow_out{

						top:0;

					}

					.popover .popover_arrow_in,.news_tag_box .popover_arrow_in{

						border-bottom-color: #fff;

    					top: 1px;

					}

					.news_tag_box .popover_arrow{

						left:81.5%;

					}

				</style>

				<div class="am-form-group">

					<div class="form" style="display:inline-block">

						<!-- <form action="/tags/index.html" method="get" >

		    				<input type="text" class="tag_name am-form-field" value="" name="search_tag" placeholder="  标签名称">

		    				<span class="am-input-group-btn" style="display:inline;">

								<input class="am-btn am-btn-default search_submit" type="submit" value="搜索" style="height:32px;font-size:14px">

							</span>

							<button type="button" class="am-btn am-btn-primary am-text-sm am-margin-left-sm get_group">同步微信标签信息</button>

						</form> 

						<div class="am-input-group am-fl">
						    <input type="text" value="" name="search_tag" placeholder="标签名称" class="tag_name am-form-field" style="width:222px;height:32px;" onkeydown="if(event.keyCode == 13){search();return;}" />
						   	<span>
								<button class="am-btn am-btn-default submit" type="button"  style="height:32px;padding-top:5px;border:1px solid #ccc;border-left:0;"><span class="am-icon-search"></span></button>
							</span>
							
						</div>
						<button type="button" class="am-btn am-btn-primary am-text-sm am-margin-left-sm get_group" >同步微信标签信息</button>-->
					</div>

					<div class="am-fr">

						<button type="button" class="am-btn am-btn-success am-text-sm am-padding-horizontal-lg news_tag">新建标签</button>

						<div class="set_tags">

							<div class="news_tag_box am-padding-lg am-text-sm" style="display:none;">

								<h4 style="margin:0;">标签名称</h4>

								<input type="text" class="am-padding-left-sm am-padding-right-lg tag_text" style="height:32px;width:250px;">

								<span class="tag_tips am-text-danger m-margin-top-sm"></span>

								<div class="am-margin-top-sm">

									<button type="button" class="am-btn am-btn-success am-text-sm am-padding-horizontal-lg tag_submit">确认</button>

									<button type="button" class="am-btn am-btn-default am-text-sm am-padding-horizontal-lg am-fr tag_cancel">取消</button>

								</div>

								<i class="popover_arrow popover_arrow_out"></i>

								<i class="popover_arrow popover_arrow_in"></i>

							</div>

						</div>

					</div>	

				</div>

				<table class="am-table am-table-striped am-table-hover am-text-sm tags_list_table">

					<thead>

						<tr>

							<th>ID</th>

							<th>标签名称</th>

							<th>标签人数</th>
 

							<th>操作</th>

						</tr>

					</thead>

					<tbody id="tbody">

					<volist name="groupList" id="vo">
						<tr>

									<td>{$vo.id}</td>

									<td> <span class="tag_name">{$vo.name}</span>
										<if condition="$vo['id'] gt 2 ">  
									<a href="javascript:void(0)" class="edit_tag_name" title="修改标签名称"><i class="am-icon-edit"></i></a>

										<div class="set_remark">

											<div class="popover am-padding-lg am-text-sm" style="display:none;">

												<h4 style="margin:0;">标签名称</h4>

												<input type="text" class="am-padding-left-sm am-padding-right-lg remark_text" style="height:32px;width:250px;">

												<span class="tag_tips am-text-danger m-margin-top-sm"></span>

												<div class="am-margin-top-sm">

													<button type="button" class="am-btn am-btn-success am-text-sm am-padding-horizontal-lg tag_name_submit" data-id="{$vo.id}">确认</button>

													<button type="button" class="am-btn am-btn-default am-text-sm am-padding-horizontal-lg am-fr tag_cancel">取消</button>

												</div>

												<i class="popover_arrow popover_arrow_out"></i>

												<i class="popover_arrow popover_arrow_in"></i>

											</div>

										</div>
										</if>
									</td> 

									<td>{$vo.count}</td>

									 

									<td>
									<if condition="$vo['id'] gt 2 ">  
										<button type="button" class="am-btn am-btn-danger am-text-sm tag_del" data-id="{$vo.id}"  ><span class="am-icon-trash-o"></span> 删除</button>
									</if>
									
									</td>

						</tr>    
						</volist>
					</tbody>

				</table>
								<ul class="am-pagination am-pagination-centered am-text-xs">    </ul>

			</div>

		</div>

		<footer class="admin-content-footer">
	<hr>
	<p class="am-padding-left">淘优惠 微信淘客系统 版权所有  Copyright © 2004-2016 爱淘客(www.itaoke.org).All Rights Reserved</p>
</footer>

	</div>

<!-- content end -->

	

</div>



<div class="am-hide"> </div>					
</html>

<script>
	function search(){
		$('.submit').click();
	}
	$(function(){

		$('.submit').click(function(){
			var tag = $.trim($('.tag_name').val());
			if(tag.length == 0){
				$('#fq_alert_info').text('搜索内容不能为空');
				$('#fq_alert').modal({});
				return false;
			}
			window.location.href = '/tags/index/search_tag/'+tag;
		});

		$('.news_tag').click(function(event){

			$('.set_tags .news_tag_box').show();

			$('.set_tags .news_tag_box .tag_text').focus();

			event.stopPropagation();

		});

		$('#tbody').on('click','.popover',function(event){

			event.stopPropagation();

		});



		$('.news_tag_box').click(function(event){

			event.stopPropagation();

		})



		$('.tag_cancel').click(function(){

			$('.popover,.tag_tips,.news_tag_box').hide();

		});



		$(document).click(function(){

			$('.popover,.tag_tips,.news_tag_box').hide();

		});



		//新建分组

		$('.tag_submit').click(function(){

			var tag_name = $.trim($('.tag_text').val());

			if(tag_name == ''){

				$('.news_tag_box .tag_tips').text('标签名称不能为空');

				return false;

			}



			var len = tag_name.length;

			if(len>12){

				$('.news_tag_box .tag_tips').text('标签名称过长');

				return false;

			}



			$('.news_tag_box').hide();



			$('.news_tag').html('<i class="am-icon-spinner am-icon-spin"></i> 新建中').attr('disabled',true);



			$.ajax({

				type:'post',

				data:{"name":tag_name},

				dataType:'json',

				url:'index.php?m=Admin&c=Weixin&a=wxtagsadd',

				success:function(data){

					$('#fq_alert_info').text(data.info);

					$('#fq_alert').modal();

					$('.tag_text').val('');

					$('.news_tag_box .tag_tips').text('').hide();

					$('.news_tag').text('新建标签').attr('disabled',false);

					if(data.status == 1){

						//$('#tbody').prepend('<tr><td></td><td><span class="tag_name">'+data.tag_info.name+'</span> <a href="javascript:void(0)" class="edit_tag_name" title="修改标签名称"><i class="am-icon-edit"></i></a><div class="set_remark"><div class="popover am-padding-lg am-text-sm" style="display:none;"><h4 style="margin:0;">标签名称</h4><input type="text" class="am-padding-left-sm am-padding-right-lg remark_text" style="height:32px;width:250px;"><span class="tag_tips am-text-danger m-margin-top-sm"></span><div class="am-margin-top-sm"><button type="button" class="am-btn am-btn-success am-text-sm am-padding-horizontal-lg tag_name_submit" data-id="'+data.tag_info.id+'">确认</button><button type="button" class="am-btn am-btn-default am-text-sm am-padding-horizontal-lg am-fr tag_cancel">取消</button></div><i class="popover_arrow popover_arrow_out"></i><i class="popover_arrow popover_arrow_in"></i></div></div></td><td>'+data.tag_info.count+'</td><td>'+data.tag_info.addtime+'</td><td><span class="remark"></span> <a href="javascript:void(0)" class="edit_remark" title="修改备注"><i class="am-icon-edit"></i></a><div class="set_remark"><div class="popover am-padding-lg am-text-sm" style="display:none;"><h4 style="margin:0;">备注内容</h4><input type="text" class="am-padding-left-sm am-padding-right-lg remark_text" style="height:32px;width:250px;"><span class="tag_tips am-text-danger m-margin-top-sm"></span><div class="am-margin-top-sm"><button type="button" class="am-btn am-btn-success am-text-sm am-padding-horizontal-lg remark_submit" data-id="'+data.tag_info.id+'">确认</button><button type="button" class="am-btn am-btn-default am-text-sm am-padding-horizontal-lg am-fr tag_cancel">取消</button></div></div></div></td><td><button type="button" class="am-btn am-btn-danger am-text-sm tag_del" data-id="'+data.tag_info.id+'"><span class="am-icon-trash-o"></span> 删除</button></td></tr>');
						location.reload();
					}

				}

			});



		});



		//修改标签名称

		$('#tbody').on('click','.edit_tag_name',function(event){

			$('.popover,.news_tag_box').hide();

			var tag_name = $(this).siblings('.tag_name').text();

			var setBox = $(this).siblings('.set_remark').children('.popover');

			setBox.show();

			setBox.children('.remark_text').val(tag_name).focus().select();

			event.stopPropagation();

		});



		//设置名称

		$('#tbody').on('click','.tag_name_submit',function(){

			$('.popover,.news_tag_box').hide();

			var old_tag_name_box = $(this).parent().parent('.popover').parent('.set_remark').siblings('.tag_name');

			var old_tag_name = old_tag_name_box.text();

			var new_tag_name = $(this).parent().siblings('.remark_text').val();

			if(old_tag_name == $.trim(new_tag_name)){

				return false;

			}

			var id = $(this).attr('data-id');

			var html = old_tag_name_box.html();

			old_tag_name_box.html('<i class="am-icon-spinner am-icon-spin"></i> 设置中');

			$.ajax({

				type:'post',

				url:'index.php?m=Admin&c=Weixin&a=wxtagsmodify',

				data:{"tag_name":new_tag_name,"id":id},

				daatType:'json',

				success:function(data){

					if(data.status == 1){

						old_tag_name_box.text(new_tag_name);

					}else{

						$('#fq_alert_info').text(data.info);

						$('#fq_alert').modal();

						old_tag_name_box.html(html);

					}

					

				}



			});



		});



		//修改备注

		$('#tbody').on('click','.edit_remark',function(event){

			$('.popover,.news_tag_box').hide();

			var remark = $(this).siblings('.remark').text();

			var setBox = $(this).siblings('.set_remark').children('.popover');

			setBox.show();

			setBox.children('.remark_text').val(remark).focus().select();

			event.stopPropagation();

		});





		//设置备注

		$('#tbody').on('click','.remark_submit',function(){

			$('.popover,.news_tag_box').hide();

			var old_remark_box = $(this).parent().parent('.popover').parent('.set_remark').siblings('.remark');

			var old_remark = old_remark_box.text();

			var new_remark = $(this).parent().siblings('.remark_text').val();

			if(old_remark == $.trim(new_remark)){

				return false;

			}

			var id = $(this).attr('data-id');



			old_remark_box.html('<i class="am-icon-spinner am-icon-spin"></i> 设置中');

			$.ajax({

				type:'post',

				url:'/tags/set_tag_remark.html',

				data:{"remark":new_remark,"id":id},

				daatType:'json',

				success:function(data){

					old_remark_box.text(new_remark);

					if(data.status == 1){

						old_remark_box.text(new_remark);

					}else{

						$('#fq_alert_info').text(data.info);

						$('#fq_alert').modal();

					}

				}



			});

			

		});



		//删除分组

		$('#tbody').on('click','.tag_del',function(){

			$('#fq_true_confirm_info').text('确认删除该分组？');

			$('#fq_true_confirm').modal({

				relatedTarget: this,

				onConfirm: function(options) {

        			var id = $(this.relatedTarget).attr('data-id');

        			var box = $(this.relatedTarget).parent('td').parent('tr');

        			$.ajax({

        				type:'post',

        				dataType:'json',

        				data:{"id":id},

        				url:'index.php?m=Admin&c=Weixin&a=wxtagsdel',

        				success:function(data){

        					$('#fq_alert').modal();

        					$('#fq_alert_info').text(data.info);

        					box.remove();

        				}

        			});

        		}	

			});



		});



		//同步微信标签

		$('.get_group').click(function(){

			$(this).attr('disabled',true);

			$.ajax({

				url:'/tags/getwxgroup.html',

				type:'post',

				success:function(res){

					if(res.status == 1){

						$('#fq_confirm_info').text(res.info);

						$('#fq_confirm').modal({

							onConfirm:function(){

								window.location.reload();

							}

						});

						$('.get_group').remove();

					}else{

						$('#fq_alert').modal({});

						$('#fq_alert_info').text(res.info);

					}

					$('.get_group').attr('disabled',false);

				}

			})

		})



	})

</script>
